/**
 * 下载组件
 * Author: liuhong
 * Date: 2017-2-23
 */

import React from 'react';
import tool from '../../../../../utils/tool';


class Download extends React.Component {
    render() {
        const { widget } = this.props;

        const bright = widget.color ? tool.isBrightColor(widget.color || '000000') : false;
        const iconSrcm = tool.getSrcmByTypeAndBright(widget.type, bright);

        const gradColor = tool.converionColor(widget.color);
        const grad = `linear-gradient(140deg, rgb(${gradColor.R},${gradColor.G},${gradColor.B}),#${widget.color})`;

        const customSrc = widget.custom && (widget.icon_src || widget.url);

        const inlineStyle = {
            opacity: widget.opacity,
            borderRadius: `${widget.radius}px`,
            background: customSrc ? 'none' : grad,
        };

        let innerNode = '';
        if (customSrc) {
            innerNode = (<img src={customSrc} className="replaceImge" />);
        }

        if (!widget.custom || !widget.icon_src && !widget.url && widget.icon_class) {
            innerNode =
              (<div className="textimg" style={{ height: `${widget.height}px`, width: 'auto' }}>
                <img className="jiaohuimg" style={{ verticalAlign: 'inherit', display: widget.icon ? 'inline' : 'none' }} src={iconSrcm} />
                <span className="jiaos" style={{ color: bright ? '#000' : '#FFF' }}>{ widget.tip_text }</span>
              </div>);
        }
        return (
          <div className="widget-inline" style={inlineStyle}>
            { innerNode }
          </div>
        );
    }
}
Download.defaultProps = {
    name: "app_download",
    type: 8,
    width: 180,
    height: 45,
    color: "f76b1c",
    shape: "circle",
    type_display: $._("APP DownLoad"),
    icon_class: "icon-appdown",
    radius:"4",
    tip_text:$._("APP DownLoad"),
    icon: 1,
}
export default Download;
